<template>
  <div class="search">
    <input
      v-model="keyword"
      class="search-input icon"
      type="search"
      :placeholder="iconsearch"
    />
  </div>
</template>

<script>
export default {
  name: "DepartmentSearch",
  data() {
    return {
      keyword: "",
      iconsearch: "\ue693输入部门/成员名称"
    };
  },
  watch: {
    keyword: function(keyword) {
      this.$emit("search", keyword);
    }
  },
  activated() {
    this.keyword = "";
  }
};
</script>

<style lang="stylus" scoped>
.search
  float: left
  margin-left 15px
  padding 0 .1rem
.search-input
  float: left
  box-sizing border-box
  height 40px
  width 250px
  font-size 14px
  padding: 0 .1rem
  line-height: 40px
  border-radius .06rem
  color: #888
  outline 0
</style>
